<template>
  <div class="goods">
    <h3>商品名称: {{pname}} </h3>
    <p>商品价格: {{price}} </p>
    <p>评价: {{info}} </p>
    <button @click="$emit('kanyidao',id)">砍一刀</button>

  </div>
</template>

<script>
export default {
  props:['pname','price','info','id']

  // props也可以写成对象格式(写对象格式,是为了加更多配置)
  // 有三个配置可以使用 required 表示必填  type 类型约束  default 默认值
  // props:{
  //   id:{},
  //   pname:{
  //     required: true, //表示父组件必须传值
  //     type:String //要求父组件传递过来的值,必须是字符串类型
  //   },
  //   price: Number,  //要求父组件传递过来的值,必须是Number类型
  //   info:{
  //     default:'非常 好吃 ',
  //     type:[String,Number] // 写多种类型,要写成数组格式
  //   }
  // }




}
</script>

<style>
  .goods{
    min-height: 50px;
    border: solid 5px black;
    border-radius: 80px;
    margin: 30px;
    text-align: left;
    font-size: 22px;
  }
  h3{
    margin-left: 80px;
  }
  p{
    margin-left: 80px;
  }
  button{
    margin-left: 100px;
    width: 80px;
    height: 40px;
  }
</style>